<style lang="scss" scoped>
hr {
    margin-top: 20px;
    margin-bottom: 0px;
    border: 0;
    border-top: 1px solid #eee;
}
#absolute {
    position: absolute;
    right: 5px;
    bottom: 5px;
}
.btn {
    height: 25px;
    background-color: yellow;
    display: inline-block;
    width: 25px;
    border: 1px solid;
    margin: 0px 4px 10px 5px;
    text-align: center;
    padding: 3px 0 0px 0;
}
#shuipingxian {
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 1px;
    background-color: red;
}
.el-header {
    height: 45px !important;
}
</style>
<template>
    <div>
        <el-row type="flex" class="row-bg" justify="space-between">
            <div>
                <span @click="reback" class="p_cals">
                    {{ $t('题库管理') }}
                </span>
                /
                <span>{{ $t('examinationManagement.check') }}</span>
            </div>
            <div>
                <el-button @click="reback">
                    {{ $t('examinationManagement.back') }}
                </el-button>
            </div>
        </el-row>

        <el-card v-loading="loading" shadow="never" body-style="padding: 10px;">
            <el-row style="padding:15px 15px 0 15px;" class="row-bg" justify="space-between">
                <div>
                    <span style="font-size:20px; color:#101010;">
                        {{ this.$route.query.id.questionPoolName }}
                    </span>
                </div>
            </el-row>
            <hr />
            <div class="box">
                <el-row>
                    <el-form ref="form" :model="form">
                        <el-col :span="18">
                            <div class="grid-content bg-purple">
                                <div class="page">
                                    <div
                                        v-for="(item, index) in dataLists"
                                        :key="index"
                                        :id="'page' + index"
                                    >
                                        <p>
                                            {{ index + 1 + '.' + item.questionName }}
                                            <span style="color:red">
                                                 {{ $t('examinationManagement.rightKey') }}
                                            </span>
                                            <span style="color:red">{{ item.answer }}</span>
                                        </p>
                                        <el-radio-group v-model="item.workContentst">
                                            <el-radio
                                                style="margin-left:20px"
                                                v-for="(items, indexs) in item.answerListVOList"
                                                :key="indexs"
                                                :label="items.optionCodes"
                                            >
                                                {{ items.optionCodes }}
                                            </el-radio>
                                        </el-radio-group>
                                    </div>
                                </div>
                            </div>
                        </el-col>
                    </el-form>
                </el-row>
            </div>
        </el-card>
    </div>
</template>
<script>
import { queryDic } from 'common/src/api/dictionary'
import UTILS from 'common/src/utils/utils'
import examinationManagement from 'common/src/api/academicBehaviorNorms/examination/examinationManagement'

export default {
    props: {
        compile: {
            type: String,
            default: ''
        },
        dataList: {
            type: Object,
            default: () => {}
        }
    },
    data() {
        return {
            value: '1',
            form: {},
            dataForm: {},
            dataLists: [],
            queryForm: {},
            secondType: '',
            workConten: [], // 已答
            workContens: [], // 未答
            workCont: [] // 答对
        }
    },
    created() {
        this.$route.query.id
        this.getQuestionDetails()
    },

    methods: {
        changeDataLists() {
            this.dataLists.forEach(el => {
                el.answerListVOList.forEach((ele, index) => {
                    ele.optionCodes = ele.optionCode + '：' + ele.optionContent
                })
            })
        },

        cancelOperate() {
            this.$refs['addform'].resetFields()
        },
        // 列表查询
        getQuestionDetails() {
            let params = {
                id: this.$route.query.id.questionPoolId
            }
            examinationManagement.getDetail(params).then(res => {
                this.dataLists = res.data
                this.dataLists.forEach(el => {
                    el.answerListVOList.forEach((ele, index) => {
                        ele.optionCodes = ele.optionCode + '：' + ele.optionContent
                    })
                })
            })
        },
        // 返回
        reback() {
            this.$router.push({
                path: '/examinationManagement',
                query: {
                    activeName: 'process'
                }
            })
        }
    }
}
</script>
